﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Basic Form - jQuery EasyUI Demo</title>
    <link rel="stylesheet" type="text/css" href="~/themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="~/themes/icon.css">
    <script type="text/javascript" src="~/Scripts/jquery.min.js"></script>
    <script type="text/javascript" src="~/Scripts/jquery.easyui.min.js"></script>
</head>
<body>
    <center>
	<h2>还书登记</h2>
	<p></p>
	<div style="margin:20px 0;"></div>
	<div class="easyui-panel" title="" style="width:100%;max-width:400px;padding:30px 60px;">
		<form id="ff" method="post">
            <div style="margin-bottom:20px">
				<input class="easyui-textbox" name="shuhao" style="width:100%" data-options="label:'书号:'">
			</div>
			<div style="margin-bottom:20px">
				<input class="easyui-textbox" name="shuming" style="width:100%" data-options="label:'书名:'">
			</div>
			<div style="margin-bottom:20px">
				<input class="easyui-textbox" name="huanshurenxuehao" style="width:100%" data-options="label:'还书人学号:'">
			</div>
			<div style="margin-bottom:20px">
				<input class="easyui-textbox" name="huanshurenxingming" style="width:100%" data-options="label:'还书人姓名:'">
			</div>
            <div style="margin-bottom:20px">
				<input class="easyui-textbox" name="huanshuriqi" style="width:100%" data-options="label:'还书日期:'">
			</div>
		</form>
		<div style="text-align:center;padding:5px 0">
			<a href="javascript:void(0)" class="easyui-linkbutton" onclick="submitForm()" style="width:80px" id="chaxun">提交</a>
			<a href="javascript:void(0)" class="easyui-linkbutton" onclick="clearForm()" style="width:80px">清除</a>
		</div>
	</div>
         <div closed="true" id="dlg" class="easyui-dialog" title="提示" style="text-align:center; width:300px;height:200px;padding:10px" data-options="
				iconCls: 'icon-save',
				buttons: [{
					text:'Ok',
					iconCls:'icon-ok',
					handler:function(){
						$('#dlg').dialog('close');
                        $('#ff').form('clear');
					}
				}]
			">
		<h2>还书成功!</h2>
	</div>
         <script type="text/javascript">
             $(document).ready(function () {
                 $("#chaxun").click(function () {
                     $('#dlg').dialog('open')
                 })
             })
    </script>
	<script>
	    function submitForm() {
	        $('#ff').form('submit');
	    }
	    function clearForm() {
	        $('#ff').form('clear');
	    }
	</script>
    </center>
</body>
</html>
